import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
import 'package:get/get.dart';
import 'package:wallet_utils/color.dart';
import 'package:wallet_utils/ht_appbar.dart';
import 'package:wallet_utils/log_util.dart';
import 'package:wallet_utils/report_widget/click_widget.dart';
import 'package:wallet_utils/safe_bottom_view.dart';
import 'package:wallet_utils/text_style.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import '../bean/controlBean.dart';
import 'logic.dart';

class ContactPersonPage extends StatelessWidget {
  final logic = Get.put(ContactPersonLogic());
  final state = Get.find<ContactPersonLogic>().state;

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () {
        logic.backPage();
        return Future.value(true);
      },
    child: KeyboardDismissOnTap(
      child: Scaffold(
        backgroundColor: ColorManager.colorFFFFFF,
        appBar: htCommonAppbar(context, title: '联系人信息',leadingAction: (){
          logic.backPage();
        }),
        bottomNavigationBar: setBottomButton(
          context,
          '下一步',
          hasShadow: false,
          onPressed: logic.state.isComplete
              ? () {
            logic.submit();
            // buildShowModalBottomSheet(context);
          }
              : null,
        ),
        body: Container(
          height: double.infinity,
          decoration: BoxDecoration(
            gradient: LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [
                ColorManager.colorFBE9DD,
                ColorManager.colorF4F5F6,
                ColorManager.colorF4F5F6,
              ],
            ),
          ),
          child: SingleChildScrollView(
            child: Column(
              children: [
                GetBuilder<ContactPersonLogic>(builder: (logic) {
                  return Stack(
                    children: [
                      Container(
                        margin: EdgeInsets.only(top: 30.w, left: 16.w, right: 16.w),
                        child: Row(
                          children: [
                            InkWell(
                              onTap: () {

                              },
                              child: Container(
                                child: Text(
                                  '总进度',
                                  style: TextStyleUtils.style343D54(fontSize: 14.sp, fontWeight: FontWeight.bold),
                                ),
                              ),
                            ),
                            SizedBox(
                              width: 10.w,
                            ),
                            Stack(
                              children: [
                                // 下面的背景盒子
                                Container(
                                  height: 4.w,
                                  width: 280.w,
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.all(Radius.circular(2.w)),
                                    color: ColorManager.colorFFFFFF,
                                  ),
                                ),
                                // 上面的进度条盒子
                                Container(
                                  height: 4.w,
                                  width: state.percent, // 动态更改进度条盒子的宽度即可
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.all(Radius.circular(15.w)),
                                    color: ColorManager.colorD93C3A,
                                  ),
                                ),
                              ],
                            ),
                          ],
                        ),
                      ),
                      Visibility(
                        visible: state.proState,
                        child: Container(
                          decoration: const BoxDecoration(
                            image: DecorationImage(
                              image: AssetImage("assets/icon_pro.png"),
                              fit: BoxFit.cover,
                            ),
                          ),
                          width: 25.w,
                          height: 15.w,
                          alignment: Alignment.center,
                          margin: EdgeInsets.only(
                            left: state.percent + 55.w,
                            top: 18.w,
                          ),
                          padding: EdgeInsets.only(bottom: 2.w),
                          child: Text(
                            state.proText,
                            style: TextStyleUtils.styleFFFFFF(fontSize: 10.sp),
                          ),
                        ),
                      ),
                    ],
                  );
                }),
                Container(
                  margin: EdgeInsets.only(left: 16.w, right: 16.w, top: 30.w),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        '资料填写',
                        style: TextStyleUtils.style000000(fontSize: 18.sp, fontWeight: FontWeight.bold),
                      ),

                    ],
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 16.w, right: 16.w, top: 5.w),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        '完善个人真实信息，确保资料充分',
                        style: TextStyleUtils.style666666(fontSize: 12.sp),
                      ),

                    ],
                  ),
                ),
                GetBuilder<ContactPersonLogic>(builder: (logic) {
                  return MediaQuery.removePadding(
                    context: context,
                    removeTop: true,
                    child: ListView.builder(
                      shrinkWrap: true,
                      itemCount: state.controlList.length,
                      physics: const NeverScrollableScrollPhysics(),
                      itemBuilder: ((context, index) {
                        return basicInfoWidget(index);
                      }),
                    ),
                  );
                })
              ],
            ),
          ),
        ),
      ),

    ),
    );
  }

  Widget basicInfoWidget(int index) {
    return Container(
      margin: EdgeInsets.only(left: 16.w, right: 16.w, top: 10.w),
      padding: EdgeInsets.only(left: 10.w, right: 10.w, top: 15.w),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(5.w)),
        color: ColorManager.colorFFFFFF,
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            child: Text(
              state.controlList[index].title ?? '',
              style: TextStyleUtils.style000000(fontSize: 16.sp),
            ),
          ),
          SizedBox(height: 15.w,),
          state.controlList[index].editType==3 ? Container(
            margin: EdgeInsets.only(bottom: 10.w),
            child: Row(
              children: [
                Text(state.controlList[index].leftContent ?? '', style: TextStyleUtils.style000000(fontSize: 15.sp)),
                Expanded(
                  child: TextField(
                    controller: state.controlList[index].contentController,
                    maxLines: 8,
                    minLines: 1,
                    autocorrect: true,
                    cursorColor: ColorManager.color353535,
                    textAlign: TextAlign.right,
                    keyboardType: TextInputType.text,
                    textAlignVertical: TextAlignVertical.center,
                    style: TextStyleUtils.style000000(fontSize: 15.sp),
                    decoration: InputDecoration(
                      isDense: true,
                      contentPadding: EdgeInsets.only(bottom: 0.w),
                      border: InputBorder.none,
                      hintText: '请输入联系人姓名',
                      hintStyle: TextStyleUtils.style999999(fontSize: 15.sp),
                    ),
                    onChanged: (text) => LogUtils.d('change $text'),
                    onSubmitted: (text) => LogUtils.d('submit $text'),
                    enabled: true,
                  ),
                )
              ],
            ),
          ): const SizedBox(),

          state.controlList[index].editType==3 ? Container(
            width: double.infinity,
            height: 0.5.w,
            color: ColorManager.colorECECEC,
          ): const SizedBox(),

          GridView.builder(
            padding: EdgeInsets.zero,
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 3,
              mainAxisSpacing: 15.w,
              crossAxisSpacing: 10.w,
              childAspectRatio: 1.8,
            ),
            itemCount: state.controlList[index].childData?.length,
            itemBuilder: (BuildContext context, int position) {
              return buildItem(state.controlList[index].childData![position], context, position, index);
            },
          ),
          SizedBox(
            height: 20.w,
          ),
          state.controlList[index].editType==2 ? Container(
            margin: EdgeInsets.only(bottom: 10.w),
            child: Row(
              children: [
                Text(state.controlList[index].leftContent ?? '', style: TextStyleUtils.style000000(fontSize: 15.sp)),
                Expanded(
                  child: TextField(
                    controller: state.controlList[index].contentController,
                    maxLines: 10,
                    minLines: 1,
                    autocorrect: true,
                    cursorColor: ColorManager.color353535,
                    textAlign: TextAlign.right,
                    keyboardType: TextInputType.text,
                    textAlignVertical: TextAlignVertical.center,
                    style: TextStyleUtils.style000000(fontSize: 15.sp),
                    decoration: InputDecoration(
                      isDense: true,
                      contentPadding: EdgeInsets.only(bottom: 0.w),
                      border: InputBorder.none,
                      hintText: '请输入居家地址',
                      hintStyle: TextStyleUtils.style999999(fontSize: 15.sp),
                    ),
                    onChanged: (text) => LogUtils.d('change $text'),
                    onSubmitted: (text) => LogUtils.d('submit $text'),
                    enabled: true,
                  ),
                )
              ],
            ),
          ):const SizedBox(),
          state.controlList[index].editType==2 ? Visibility(
            visible: true,
            child: Container(
              width: double.infinity,
              height: 0.5.w,
              margin: EdgeInsets.only(bottom:20.w,),
              color: ColorManager.colorECECEC,
            ),
          ) : const SizedBox(),
          state.controlList[index].editType==4 ? Container(
            margin: EdgeInsets.only(bottom: 10.w),
            child: Row(
              children: [
                Text(state.controlList[index].leftContent ?? '', style: TextStyleUtils.style000000(fontSize: 15.sp)),
                Expanded(
                  child: TextField(
                    controller: state.controlList[index].contentController,
                    maxLines: 10,
                    minLines: 1,
                    autocorrect: true,
                    cursorColor: ColorManager.color353535,
                    textAlign: TextAlign.right,
                    keyboardType: TextInputType.text,
                    textAlignVertical: TextAlignVertical.center,
                    style: TextStyleUtils.style000000(fontSize: 15.sp),
                    decoration: InputDecoration(
                      isDense: true,
                      contentPadding: EdgeInsets.only(bottom: 0.w),
                      border: InputBorder.none,
                      hintText: '请输入公司地址',
                      hintStyle: TextStyleUtils.style999999(fontSize: 15.sp),
                    ),
                    onChanged: (text) => LogUtils.d('change $text'),
                    onSubmitted: (text) => LogUtils.d('submit $text'),
                    enabled: true,
                  ),
                )
              ],
            ),
          ):const SizedBox(),
          state.controlList[index].editType==4 ? Visibility(
            visible: true,
            child: Container(
              width: double.infinity,
              height: 0.5.w,
              margin: EdgeInsets.only(bottom:20.w,),
              color: ColorManager.colorECECEC,
            ),
          ) : const SizedBox(),

          Container(
            margin: EdgeInsets.only(bottom: 20.w),
            child: Row(
              children: [
                Text(state.controlList[index].leftUnit ?? '', style: TextStyleUtils.style000000(fontSize: 15.sp)),
                Expanded(
                  child: TextField(
                    controller: state.controlList[index].unitController,
                    maxLines: 10,
                    minLines: 1,
                    autocorrect: true,
                    cursorColor: ColorManager.color353535,
                    textAlign: TextAlign.right,
                    inputFormatters: [
                      LengthLimitingTextInputFormatter(11)
                    ],
                    keyboardType: state.controlList[index].title=='职业身份(单选)'?TextInputType.text:TextInputType.phone,
                    textAlignVertical: TextAlignVertical.center,
                    style: TextStyleUtils.style000000(fontSize: 15.sp),
                    decoration: InputDecoration(
                      isDense: true,
                      contentPadding: EdgeInsets.only(bottom: 0.w),
                      border: InputBorder.none,
                      hintText: logic.getPlaceholder(state.controlList[index].title!),
                      hintStyle: TextStyleUtils.style999999(fontSize: 15.sp),
                    ),
                    onChanged: (text) => LogUtils.d('change $text'),
                    onSubmitted: (text) => LogUtils.d('submit $text'),
                    enabled: true,
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget buildItem(ChildData? childInfo, BuildContext context, int position, int index) {
    return ClickWidget(
      onTap: () {
        logic.isCheckStatus(position, index);
      },
      child: Container(
        height: 42.w,
        alignment: Alignment.center,
        decoration: BoxDecoration(
          color: ColorManager.colorF8F9FA,
          //设置四周圆角 角度 这里的角度应该为 父Container height 的一半
          borderRadius: const BorderRadius.all(Radius.circular(4.0)),
          border: Border.all(width: 1, color: childInfo?.isSelect == true ? ColorManager.colorD93C3A : ColorManager.colorF8F9FA),
        ),
        child: Text(
          childInfo?.name ?? '',
          style: childInfo?.isSelect == true
              ? TextStyleUtils.styleD93C3A(fontSize: 13.sp)
              : TextStyleUtils.style333333(fontSize: 13.sp),
        ),
      ),
    );
  }
}
